<template>
    <div style="background-color: #F4F4F4" >
         <Mytop></Mytop>
        <div class="MineCenter">
            <a-tabs default-active-key="1" @change="callback" tabPosition="left">
                <a-tab-pane key="1" tab="我的主页">
                    <Homepage></Homepage>
                </a-tab-pane>
                <a-tab-pane key="2" tab="我的课程" force-render>
                    <div style="font-size: 30px;margin-top: 20px">订单都没有还想上课？</div>
                </a-tab-pane>
                <a-tab-pane key="3" tab="我的订单">
                    <div style="font-size: 30px;margin-top: 20px">你个穷逼订单都没有</div>
                </a-tab-pane>
            </a-tabs>
        </div>
         <Footer></Footer>
    </div>
</template>

<script>
    import Mytop from "../components/Mytop";
    import Footer from "../components/Footer";
    import Homepage from "../components/Homepage";
    export default {
        name: "Mine",
        components:{Mytop,Footer,Homepage},
        data(){
            return{

            }
        },
        methods: {
            callback(key) {
                console.log(key);
            },
        },
    }
</script>

<style scoped lang="less">
    .MineCenter {
        height: 723px;
        margin: 20px 160px;
        padding: 20px 0px 0px 40px ;
        background-color: white;
    }

</style>